<template>
  <div class="root">
    <el-tree :data="data" :load="loadNode" :props="defaultProps" class="depttree" lazy @node-click="chg"></el-tree>
    <span class="current">上级:{{ name }} </span>
  </div>
</template>

<script>
export default {
  data() {
    return {
      user: {},
      data: [],
      defaultProps: {
        children: 'children',
        label: 'dictname',
        isLeaf: 'isLeaf'
      },
      pid: "",
      name: ""

    }
  },

  created() {
    this.user = this.$session.getUser();

  },
  methods: {

    chg(data) {
      this.name = data.dictname;
      this.$emit("change", data)
    },
    init(pid, name) {
      this.name = name;
      let params = {
        "pid": pid,
        "euid": this.user.euid
      };
      this.$api.queryDictTree(params)
        .then(res => {
          //判断接口数据是否正常
          if (res.code === 200) {
            this.data = res.data;
          }
        })
    },

    loadNode(node, resolve) {
      if (node.data.id === undefined)
        return;
      let params = {
        "pid": node.data.id,
        "euid": this.user.euid
      };
      this.$api.queryDictTree(params)
        .then(res => {
          //判断接口数据是否正常
          if (res.code === 200) {
            resolve(res.data);
          }
        })
    },
  }
}
</script>

<style scoped>
.root {
  width: 60%;
  border: #ddd solid 1px;
  border-radius: 5px;
  margin-left: 20px;
}

.depttree {
  margin: 10px;
}

.current {
  color: #999;
  margin-left: 20px;
}
</style>
